<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="../js/css.js"></script>
    <link rel="stylesheet" href="../css/style-zj.css">
    <link rel="stylesheet" href="../css/mescroll.min.css">
    <style type="text/css">
        /*mescroll滚动的区域*/
        .mescroll {
            position: fixed;
            top: 94px;
            bottom: 0;
            height: auto;
            box-sizing: border-box;
            padding: 0 10px;
        }
    </style>
</head>
<body class="bg_fe">
    <header><a class="icon_back"></a>进度列表</header>
    <div class="progress-list mart-44" id="vue-box" v-cloak>
        <div class="title-1 font-16">进度查询</div>
        <div class="order-c" style="padding: 0">
            <!--滑动区域-->
            <div id="mescroll" class="mescroll">
                <div class="data-list">
                    <div class="li go-progress" v-for="item in pageList" :id="item.id">
                        <div class="png"><img :src="imgBaseurl + item.storeImg" alt=""></div>
                        <div class="content font-14">
                            <div class="text-1 font-16"><span>{{item.storeName}}</span><span  class="status">{{item.schedule | status}}</span></div>
                            <div class="text-2">{{item.goodName}}</div>
                            <div class="text-3">
                                总价：<span>￥{{item.totalPay}}</span>
                                <!--<span class="btn-m">付款</span>-->
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="../js/config.js"></script>
<script src="../js/mescroll.min.js" type="text/javascript" charset="utf-8"></script>
<script>
    $(document).on('click','.go-progress',function(){
        window.location.href='progress.html?orderId='+$(this).attr('id');
    })
    var sendData = {
        limit: '',
        page: '',
        token: token
    }

    var app = new Vue({
        el:'#vue-box',
        data:{
            pageList:[],
            imgBaseurl:imgBaseurl,
        },
        mounted:function(){
            var self = this;
            self.mescroll = new MeScroll("mescroll", {
                up: {
                    callback: self.upCallback, //上拉回调
                    page: {size: 8}, //可配置每页8条数据,默认10
                    empty: { //配置列表无任何数据的提示
                        warpId: "vue-box",
                        tip: "亲,暂无相关数据哦~",
//
                    },
                    lazyLoad: {
                        use: true // 是否开启懒加载,默认false
                    }
                }
            });
//            get_ajax("order/getScheduleList", {limit:10,page:1,token:token}, function (data) {
//                app.pageList = data.list;
//            });
        },
        methods:{
            upCallback: function (page) {
                var self = this;
                getListDataFromNet(page.num, page.size, function (curPageData, totalPage) {
                    if (page.num == 1) self.pageList = [];
                    self.pageList = self.pageList.concat(curPageData);
                    console.log("page.num=" + page.num + ", page.size=" + page.size + ", curPageData.length=" + curPageData.length + ", self.pageList.length==" + self.pageList.length);
                    self.mescroll.endByPage(curPageData.length, totalPage); //必传参数(当前页的数据个数, 总页数)
                }, function () {
                    self.mescroll.endErr();
                });
            },
        },
        filters: {
            status: function (value) {
                if(value==1){
                    return value = '待排期'
                }else if(value==2){
                    return value = '待拍摄'
                }else if(value==3){
                    return value = '样片排期'
                }else if(value==4){
                    return value = '待选片'
                }

            }
        }

    })
    //分页方法
    function getListDataFromNet(pageNum, pageSize, successCallback, errorCallback) {
        sendData.limit = pageSize;
        sendData.page = pageNum;
        get_ajax("order/getScheduleList", sendData, function (data) {
            var data = data.list;
            var tolPag = 1000;
            var listData = data
//                listData = [];
            successCallback && successCallback(listData, tolPag);//成功回调
        });
    }
</script>
</html>